/**app.wxss**/
.container {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  flex: 1;
  padding-bottom: env(safe-area-inset-bottom);
}

.style {
  --color-000000: #000000;
  --color-666666: #666666;
  --color-999999: #999999;
  --color-CCCCCC: #cccccc;
  --color-EEEEEE: #eeeeee;
  --color-white: #ffffff;
  --color-FE5953: #fe5953;
  --color-F8F8F8: #f8f8f8;
  --color-F6F6F6: #f6f6f6;
  --color-EAEEFE: #eaeefe;
  --color-3B5DF3: #3b5df3;
  --color-FA8A4B: #fa8a4b;
  --color-4FBE99: #4fbe99;
}

.style-shengang {
  --color-theme: #FF0012;
}

.style-dongguan {
  --color-theme: #3b5df3;
}

.style-red {
  --color-theme: #FF0012;
}

.style-blue {
  --color-theme: #3b5df3;
}

.loading {
  .skeleton {
    background-color: #ccc;
  }
}

page {
  background: #F8F8F8;
  height: 100vh;
  display: flex;
  flex-direction: column;
}


@keyframes faeInToUp {
  0% {
    transform: translateY(24px);
    opacity: 0;
  }

  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}

@keyframes toUp {
  0% {
    transform: translateY(50%);
    opacity: 0;
  }

  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}

@keyframes enterFromBothSides {
  0% {
    opacity: 0;
    width: 200%;
    transform: translateX(-25%);
  }

  100% {
    opacity: 1;
    width: 100%;
    transform: translateX(0%);
  }
}


@keyframes toWidth {
  0% {
    width: 100%;
  }

  100% {
    width: 220rpx;
  }
}

@keyframes enter {
  0% {
    transform: translateY(24px);
    opacity: 0;
  }

  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}

@keyframes leave {
  0% {
    transform: translateY(0px);
    opacity: 1;
  }

  100% {
    transform: translateY(200px);
    opacity: 0;
  }
}